<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <!--<link href="__CSS__/bootstrap.min.css?v=3.3.6" rel="stylesheet">-->
    <!--<link href="__CSS__/font-awesome.css?v=4.4.0" rel="stylesheet">-->

    <!--<link href="__CSS__/animate.css" rel="stylesheet">-->
    <!--<link href="__CSS__/style.css?v=4.1.0" rel="stylesheet">-->
    <!--<script src="http://static.runoob.com/assets/jquery-validation-1.14.0/lib/jquery.js"></script>-->
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="__CSS__/home/book.css">
    <link rel="stylesheet" href="__CSS__/home/actual_combat.css">

    <script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>


                         <!--头部开始-->
                         <div class="container"style="background-color: black">
                             <div class="row"  style="padding: 1rem;">
                                 <div class="col-xs-12" >
                                     <a href="{:url('Index/index')}"  style="font-size: 1rem;color:white;">
                                         <span style="font-size: 1rem"class="glyphicon glyphicon-tint"></span>在线学习
                                     </a>

                                 </div>
                             </div>
                             </div>
                         <!--头部结束-->


                         <!--轮播开始-->
                         <div class=" rows ">
                             <div id="myCarousel" class="carousel slide ">


                                 <!-- 轮播（Carousel）项目 -->
                                 <div class="carousel-inner text-center">
                                     <div class="item active">
                                         <img src="{$user.0.img}" alt="First slide">
                                     </div>
                                     <div class="item">
                                         <img src="{$user.1.img}" alt="Second slide">
                                     </div>
                                     <div class="item">
                                         <img src="{$user.2.img}" alt="Second slide">
                                     </div>
                                     <div class="item">
                                         <img src="{$user.3.img}" alt="Second slide">
                                     </div>
                                     <div class="item">
                                         <img src="{$user.4.img}" alt="Second slide">
                                     </div>
                                 </div>
                                 <!-- 轮播（Carousel）导航 -->
                                 <a class="left carousel-control" href="#myCarousel" data-slide="prev">
                                     <span class="glyphicon glyphicon-chevron-left"></span>
                                 </a>
                                 <a class="right carousel-control" href="#myCarousel" data-slide="next">
                                     <span class="glyphicon glyphicon-chevron-right"></span>
                                 </a>
                             </div>

                         </div>
                         <!--轮播结束-->



                             <!--方向分类开始-->
                        <div class="container">
                            <div class="row">
                                         {volist name="class" id="name"}
                                <div class="" style=" padding: 5px;display: inline-block">
                                         <div class="btn btn-danger" style="border-radius: 1.5rem">
                                           <a  style="font-size: 3px; color:#ffffff;" href="{:url('ActualCombat/index')}?class_id={$name.id}">{$name.name}</a>
                                         </div>
                                </div>
                                         {/volist}
                            </div>
                        </div>
                         <!--方向分类结束-->

                         <!--头部结束-->



                         <!--课程部分开始-->
                         {volist name="course" id="val"}
                         <div class="container">
                             <div class="row " style="margin: 1rem;height: 100px;background-color: rgba(240,236,231,0.08)">
                                 <div class=" col-sm-4 col-xs-4  " style="height: 100%;font-size: xx-small;background-image: url('__IMAGES__/su3.jpg');text-shadow:3px 1px 2px #fffdfe">
                                     <div style="color: #fff6f9;" >
                                         <br>
                                         <p style="border-bottom: 1px black solid">  {$val.record_name}</p>
                                         <p>  <strong>{$val.category}</strong></p>
                                     </div>
                                 </div>

                                 <div class=" col-sm-8 col-xs-8  text-left" style="height: 100%;padding: 1rem">
                                     <a href="{:url('Chapter/chaptershow')}?id={$val.id}">
                                         <!--简介：-->
                                         <div style="height: 50px;font-size: 10px"> {$val.introduce}</div>
                                         <p> 具体难度：  {$val.difficulty}</p>
                                         <span style="color: #ff041d;" class="pull-right">￥{$val.charge} </span>
                                     </a>
                                 </div>
                             </div>
                         </div>
                         {/volist}
                         <!--课程训话部分结束-->
<div class="container">
    <center><div class="col-xs-push-6">{$page}</div></center>
</div>

</body>
</html>
<script>
    $('.carousel').carousel({
        interval: 2000
    })
</script>